import { Module } from "webpack";
import * as ExtractTextPlugin from "extract-text-webpack-plugin";
import * as Autoprefixer from "autoprefixer";
import AppConfig from "./app.config";

const config: Module = {
    rules: [{
        test: /\.tsx?$/,
        loader: "awesome-typescript-loader"
    }, {
        test: /\.scss$/,
        use: ExtractTextPlugin.extract({
            fallback: "style-loader",
            use: [{
                loader: "css-loader",
                options: {
                    importLoaders: 1,
                    modules: true,
                    localIdentName: "[local]-[hash:8]",
                    sourceMap: AppConfig.dev ? true : false,
                    minimize: AppConfig.dev ? false : true,
                }
            }, {
                loader: "sass-loader"
            }, {
                loader: "postcss-loader",
                options: {
                    ident: "postcss",
                    plugins: () => [
                        require("postcss-flexbugs-fixes"),
                        Autoprefixer({
                            browsers: [
                                "> 1%",
                                "last 2 versions",
                                "Firefox ESR",
                                "not ie < 9", // React doesn't support IE8 anyway
                            ],
                            flexbox: "no-2009"
                        })
                    ]
                }
            }]
        })
    }, {
        test: [/\.(bmp|gif|jpe?g|png)$/],
        loader: "url-loader",
        options: {
          limit: 10000,
          name: "assets/images/[name].[hash:8].[ext]"
        }
    }, {
        test: /\.(woff|woff2|ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
        loader: "url-loader",
        options: {
            limit: 10000,
            name: "assets/fonts/[name].[hash:8].[ext]"
        }
    }]
};
export default config;
